<!DOCTYPE html>
<script type="text/javascript" src="../js/angular.min.js"></script>
<script type="text/javascript" src="../js/angular-route.min.js"></script>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>

	<body>
		<div ng-app="myApp">
			<h6>Head</h6>
			<ul>
				<li>
					<a href="#/">首页</a>
				</li>
				<li>
					<a href="#/products">商品管理</a>
				</li>
				<li>
					<a href="#/users">用户管理</a>
				</li>
				<li>
					<a href="#/blabla">其他</a>
				</li>
			</ul>
			<div ng-view></div>
			<h6>Foot</h6>
		</div>
	</body>

</html>
<script>
		var app = angular.module("myApp", ['ngRoute']);
		app.config(["$routeProvider", function($routeProvider) {
			$routeProvider
				.when('/', {
					template: '这是首页页面'
				})
				.when('/products', {
					templateUrl: './05_route_1.html'
				})
				.when('/users', {
					templateUrl: './05_route_2.html'
				})
				.otherwise({
					redirectTo: '/'
				});
		}]);

//	angular.module('myApp', ['ngRoute'])
//		.config(['$routeProvider', function($routeProvider) {
//			$routeProvider
//				.when('/', {
//					template: '这是首页页面'
//				})
//				.when('/products', {
//					template: '这是电脑分类页面'
//				})
//				.when('/users', {
//					template: '这是打印机页面'
//				})
//				.otherwise({
//					redirectTo: '/'
//				});
//		}]);
</script>